import React, { Component } from "react";
import { Table, Divider, Tag, Button } from "antd";
import "antd/dist/antd.css"; // or 'antd/dist/antd.less'
import { render } from "react-dom";
class Index extends Component {
  constructor(props) {
    super(props);
    this.handleapprove = this.handleapprove.bind(this);
    this.handlenotaprrove = this.handlenotaprrove.bind(this);
    this.state = {
      columns: [
        {
          title: "Name",
          dataIndex: "name",
          key: "name",
          render: text => <a>{text}</a>
        },
        {
          title: "Age",
          dataIndex: "age",
          key: "age"
        },
        {
          title: "Address",
          dataIndex: "address",
          key: "address"
        },
        {
          title: "Tags",
          key: "tags",
          dataIndex: "tags"
        },
        {
          title: "Action",
          dataIndex: "age",
          key: "action",
          render: record => {
            let age = record;
            if (age > 50) {
              return (
                <dir>
                  <Button
                    type="primary"
                    onClick={this.handleapprove.bind(this, age)}
                  >
                    批准
                  </Button>
                </dir>
              );
            } else {
              return (
                <dir>
                  <Button
                    type="primary"
                    onClick={this.handlenotaprrove.bind(this, age)}
                  >
                    不批准
                  </Button>
                </dir>
              );
            }
          }
        }
      ],
      data: [
        {
          key: "1",
          name: "John Brown",
          age: 32,
          address: "New York No. 1 Lake Park",
          tags: ["nice", "developer"]
        },
        {
          key: "2",
          name: "Jim Green",
          age: 67,
          address: "London No. 1 Lake Park",
          tags: ["loser"]
        },
        {
          key: "3",
          name: "Joe Black",
          age: 32,
          address: "Sidney No. 1 Lake Park",
          tags: ["cool", "teacher"]
        },
        {
          key: "4",
          name: "Joe Black",
          age: 88,
          address: "Sidney No. 1 Lake Park",
          tags: ["cool", "teacher"]
        },
        {
          key: "5",
          name: "Joe Black",
          age: 32,
          address: "Sidney No. 1 Lake Park",
          tags: ["cool", "teacher"]
        },
        {
          key: "6",
          name: "Joe Black",
          age: 32,
          address: "Sidney No. 1 Lake Park",
          tags: ["cool", "teacher"]
        },
        {
          key: "7",
          name: "Joe Black",
          age: 55,
          address: "Sidney No. 1 Lake Park",
          tags: ["cool", "teacher"]
        }
      ]
    };
  }

  handleapprove(a) {
    console.log("批准~~~~~~~~~~" + a);
  }

  handlenotaprrove(a) {
    console.log("不批准~~~~~~~~~" + a);
  }
  render() {
    return (
      <div className="all">
        <Table columns={this.state.columns} dataSource={this.state.data} />
        {/* <Button type="primary">Primary</Button> */}
      </div>
    );
  }
}

export default Index;
